//节目运营-节目管理-表单项-播放渠道控件
App.util.ns('Admin.Program.Section.Form');
Admin.Program.Section.Form.Playways = function(config){
    this.config = config;
    this.name = this.config.name;
    this.form = null;
    this.frame = null;
    this.items = [];
    this.mainItem = null;
    //初始化
    this.init();
};
Admin.Program.Section.Form.Playways.prototype = {
    constructor: Admin.Program.Section.Form.Playways,
    init: function(){
        var self = this;
        this.frame = $([
            '<div class="program-playways-container">',
            '   <div class="item main">',
            '       <div class="input-group" style="width:100%">',
            '           <input type="text" class="form-control playways-url" placeholder="请填写视频url">',
            '           <span class="input-group-btn">',
            '               <button class="btn btn-default btn-sm btn-add" type="button" style="border-radius: 0;"><i class="fa fa-plus"></i></button>',
            '           </span>',
            '       </div>',
            '       <span class="form-static" style="display: none;"></span>',
            '   </div>',
            '</div>'
        ].join(''));
        var playwaysChosen = self.getPlaywaysChosen().frame;
        playwaysChosen.css({width: '120px', height: '30px', float: 'left'});
        playwaysChosen.find('.dropdown-toggle').css({'border-right': 'none'});
        playwaysChosen.addClass('playways');
        this.frame.find('.item > .input-group').prepend(playwaysChosen);
        this.frame.find('.playways-url').css({float: 'left', width: 'calc(100% - 150px)', height: '30px'});
        this.frame.find('.input-group-btn').css({float: 'left'});
        this.frame.find('.btn-add').click(function(){
            self.getItem().appendTo(self.frame);
        });
        return this;
    },
    setForm: function(form){
        this.form = form;
    },
    getPlaywaysChosen: function(){
        var self = this;
        return new App.Form.Select({
            name: 'playways'+self.itemCount, title: '播放渠道',
            items: App.models.get('playways'),
            item_key: 'id',
            item_name: 'name'
        });
    },
    getItem: function(){
        this.itemCount += 1;
        var self = this;
        var item = $([
            '<div class="item">',
            '    <div class="input-group" style="width:100%">',
            '        <input type="text" class="form-control playways-url" placeholder="请填写视频url">',
            '        <span class="input-group-btn">',
            '            <button class="btn btn-default btn-sm btn-drop" type="button" style="border-radius: 0;"><i class="fa fa-times"></i></button>',
            '        </span>',
            '    </div>',
            '    <div class="form-static" style="display: none;"></div>',
            '</div>'
        ].join(''));
        var playwaysChosen = self.getPlaywaysChosen().frame;
        playwaysChosen.css({width: '120px', height: '30px', float: 'left'});
        playwaysChosen.find('.dropdown-toggle').css({'border-right': 'none'});
        playwaysChosen.addClass('playways');
        item.find('.input-group').prepend(playwaysChosen);
        item.find('.playways-url').css({float: 'left', width: 'calc(100% - 150px)', height: '30px'});
        item.find('.input-group-btn').css({float: 'left'});
        item.find('.btn-drop').click(function(){
            item.remove();
        });
        for(var i in this.providers){
            item.find('.provider-id').append($('<option value="'+this.providers[i]['id']+'">'+this.providers[i]['name']+'</option>'));
        }
        return item;
    },
    change: function(val){//改变
        this.reset();
        val = JSON.parse(val) ? JSON.parse(val) : '';
        for(var i in val){
            var item = val[i];
            var playwaysId = item['playways_id'] ? item['playways_id'] : '';
            var url = item['url'] ? item['url'] : '';
            if(i+'' === '0'){
                this.frame.find('.item.main .playways select').val(playwaysId);
                this.frame.find('.item.main .playways-url').val(url);
            }else{
                var itemObj = this.getItem();
                itemObj.find('.playways select').val(playwaysId);
                itemObj.find('.playways-url').val(url);
                itemObj.appendTo(this.frame);
            }
        }
        return this;
    },
    view: function(){//查看
        this.flushView();
        this.frame.find('.item > .input-group').hide();
        this.frame.find('.item > .form-static').show();
        return this;
    },
    flushView: function(){
        this.frame.find('.item').each(function(){
            var playwaysId = $(this).find('.playways select').val();
            var playwaysName = '';
            var url = $(this).find('.playways-url').val();
            $(this).find('.playways select > option').each(function(){
                if($(this).attr('value')+'' === playwaysId+''){
                    playwaysName = $(this).text();
                }
            });
            $(this).find('.form-static').html('<span>'+playwaysName+':&emsp;'+url+'</span>');
        });
    },
    reset: function(){
        this.frame.find('.item').each(function(){
            if(!$(this).hasClass('main')){
                $(this).remove();
            }
        });
        this.frame.find('.item.main').find('select').val('').change();
        this.frame.find('.item.main').find('input').val('').change();
        this.frame.find('.item > .input-group').show();
        this.frame.find('.item > .form-static').hide();
        return this;
    },
    edit: function(){
        this.frame.find('.item > .input-group').show();
        this.frame.find('.item > .form-static').hide();
        return this;
    },
    value: function(){
        var self = this;
        var data = [];
        this.frame.find('.item').each(function(){
            var playwaysId = $(this).find('.playways select').val();
            var url = $(this).find('.playways-url').val();
            data.push({
                playways_id: playwaysId,
                url: url
            });
        });
        return JSON.stringify(data);
    }, 
    enable: function(){
        this.frame.find('select').prop('disabled', false);
        this.frame.find('input').prop('disabled', false);
        return this;
    },
    disable: function(){
        this.frame.find('select').prop('disabled', true);
        this.frame.find('input').prop('disabled', true);
        return this;
    },
    validate: function(){
        var rs = true;
        this.frame.find('.input-group').each(function(){
            var playwaysId = $(this).find('select').val();
            var url = $(this).find('input').val();
            if((playwaysId.length < 1) && (url.length > 1)){
                $(this).find('select').addClass('error').one('change', function(){
                    $(this).removeClass('error');
                });
                rs = false;
            }else if((playwaysId.length > 1) && (url.length < 1)){
                $(this).find('input').addClass('error').one('change', function(){
                    $(this).removeClass('error');
                });
                rs = false;
            }
        });
        return rs; 
    },
    onChange: function(){
        if(this.config.onChange){
            this.config.onChange(this);
        }
    },
    destroy: function(){
        this.frame.remove();
    }
};
//添加到库
App.Form.lib['admin-program-section-playways'] = Admin.Program.Section.Form.Playways;